<template>
	<view>
		<view>
		    <xy-list-item
		        type="media"
		        :title="item.title + ''"
		        :key="index"
		        :value="item.id + ''"
				:image="item.cover"
		        v-for="(item,index) in info.orderSkuList"
		        titleFs="14px">
				<template slot="info">
					<view class="left text-gray">
						<view class="des m-t-xs" style="margin-left: -10px;">
							<xy-tag type="gray" size="middle" class="font-xs bg-gray">
								{{item.spec}}
							</xy-tag>
						</view>
						<view class="price text-error">
							<view class="font-md">
								¥<text class="">&nbsp;&nbsp;{{item.price}}</text>
								<text class="m-l-sm text-gray font-sm"></text>
							</view>
						</view>
					</view>
					<view class="right p-t-xs font-sm text-gray">
						<text>x{{item.amount}}</text>
					</view>
				</template>
		    </xy-list-item>
		</view>
		<view class="extra m-t">
			<xy-list-item
				type="input"
				title="获取状态"
				titleFs="14px">
				<template slot="titleRight">
					<xy-picker v-model="info.type" :options="deliverStateList"></xy-picker>
				</template>
			</xy-list-item>
			<xy-list-item
				type="input"
				title="退货方式"
				titleFs="14px">
				<template slot="titleRight">
					<xy-picker v-model="info.deliverState" :options="typeList"></xy-picker>
				</template>
			</xy-list-item>
			<xy-list-item
				type="input"
				title="退货原因"
				titleFs="14px">
				<template slot="titleRight">
					<xy-picker v-model="info.reasonId" :options="reasonList"></xy-picker>
				</template>
			</xy-list-item>
			<xy-list-item
				type="input"
				title="退货金额"
				titleFs="14px">
				<template slot="titleRight">
					<input type="text" v-model="info.money" placeholder="请输入退款金额"/>
				</template>
			</xy-list-item>
		</view>
		<uni-steps
			direction="column"
			active-color="red"
			:options="info.logList">
		</uni-steps>
		<view class="action" v-if="currentLog.handler == 0 || currentLog.handler == 3 || currentLog.handler == 4">
			<button class="m-l m-r m-t" @click="cancel" type="default">取消</button>
		</view>
		<view class="action" v-else-if="currentLog.handler == 1" >
			<button class="m-l m-r m-t" @click="submit" type="primary">重新提交</button>
			<button class="m-l m-r m-t" @click="submit(1)" type="default">申请介入</button>
		</view>
		<view class="action" v-else-if="currentLog.handler == 2" >
			<!-- 2有多种情况，卖家出于待处理、待确认收货、待退款 -->
			<view v-if="info.state < 2">
				<button class="m-l m-r m-t" @click="cancel" type="default">取消</button>
			</view>
			<view v-else-if="info.state == 2">
				<button class="m-l m-r m-t" @click="deliverPopup" type="primary">发货</button>
				<button class="m-l m-r m-t" @click="cancel" type="default">取消</button>
			</view>
		</view>
		<uni-popup ref="popup" type="bottom">
			<xy-list-item
				type="input"
				title="快递公司"
				titleFs="14px">
				<template slot="titleRight">
					<xy-picker v-model="info.deliverCompany" :options="deliverList"></xy-picker>
				</template>
			</xy-list-item>
			<xy-list-item
				type="input"
				title="快递单号"
				titleFs="14px">
				<template slot="titleRight">
					<input type="text" v-model="info.deliverNo" placeholder="请输入快递单号"/>
				</template>
			</xy-list-item>
			<button class="m-l m-r m-t" @click="deliver" type="primary">确认发货</button>
		</uni-popup>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				deliverModel: false,
				orderSkuId: 0,
				info: {},
				currentLog: {},
				deliverStateList: [
					{
						title: '已收到货',
						value: '1',
					},
					{
						title: '未收到货',
						value: '2',
					},
				],
				typeList: [
					{
						title: '退货退款',
						value: '1',
					},
					{
						title: '仅退款',
						value: '2',
					},
					{
						title: '仅退货',
						value: '3',
					}
				],
				reasonList: [
					{
						title: '多拍/错拍/',
						value: '1',
					}
				],
				deliverList: []
			};
		},
		onLoad(options) {
			this.orderSkuId = options.orderSkuId;
			this.loadData();
		},
		methods: {
			async cancel () {
				uni.showLoading({
					title: '加载中...'
				});
				// 获取数据
				let res = await this.util.request({
					url: '/v1/ishop/order_return/cancel/' + info.id,
					method: 'delete'
				});
				uni.showModal({
					content: res.msg,
					success: async (e)=>{
					}
				});
				uni.hideLoading();
			},
			deliverPopup(){
				this.$refs.popup.open();
			},
			async deliver() {
				uni.showLoading({
					title: '加载中...'
				});
				// 获取数据
				let res = await this.util.request({
					url: '/v1/ishop/order_return/deliver/' + info.id,
					method: 'post', 
					data: {
						deliverNo: this.info.deliverNo,
						deliverCompany: this.info.deliverCompany,
					}
				});
				uni.showModal({
					content: res.msg,
					success: async (e)=>{
					}
				});
				uni.hideLoading();
			},
			async submit(isPlatform = 0) {
				uni.showLoading({
					title: '加载中...'
				});
				// 获取数据
				let res = await this.util.request({
					url: '/v1/ishop/order_return/reApply/' + info.id,
					method: 'post', 
					data: {
						type: this.info.type,
						reasonId: this.info.reasonId,
						money: this.info.money,
						isPlatform: isPlatform
					}
				});
				uni.showModal({
					content: res.msg,
					success: async (e)=>{
					}
				});
				uni.hideLoading();
			},
			async loadData () {
				uni.showLoading({
					title: '加载中...'
				});
				// 获取数据
				let res = await this.util.request({
					url: '/v1/ishop/order_return/info',
					method: 'get',
					data: {
						orderSkuId: this.orderSkuId
					}
				});
				if (res.code == 200) {
					this.info = res.data.info;
					for (let s of this.info.logList) {
						if (s.id == this.info.logId) {
							this.currentLog = s;
						}
					}
					console.log(this.currentLog);
					this.reasonList = res.data.reasonList;
					this.deliverList = res.data.deliverList;
				} else {
					uni.showModal({
						content: res.msg,
						success: async (e)=>{
							uni.navigateBack();
						}
					});
				}
				uni.hideLoading();
			}
		}
	}
</script>

<style lang="scss">
	.extra {
		/deep/ .xy-list-item {
			.left {
				margin-right: 40px;
			}
		}
	}
</style>
